{% extends 'base/base.html' %}

{% set name=request.args.get('name', '') %}

{% block content %}
    <div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="v-pills-home-tab">
        <table class="table table-striped">
            <thead>
            <tr>
                <th>#</th>
                <th>名称</th>
                <th>价格</th>
                <th>状态</th>
                <th>操作</th>
            </tr>
            </thead>
            <tbody>
                {% for product in page_data.items %}
                    <tr>
                        <td>{{ product.id }}</td>
                        <td>{{ product.name }}</td>
                        <td>{{ product.price }}</td>
                        <td>{{ product.status }}</td>
                        <td>
                              <a href="{{ url_for('mall.product_detail', uid=product.uid) }}" type="button" class="btn btn-primary">详情</a>
                              <a href="{{ url_for('mall.product_edit', uid=product.uid) }}" type="button" class="btn btn-primary">修改</a>
                              <a type="button" class="btn btn-primary del-prod" data-url="{{ url_for('mall.product_delete', uid=product.uid) }}">删除</a>
                        </td>
                    </tr>
                {% endfor %}
            </tbody>
        </table>
        <nav aria-label="...">
          <ul class="pagination">
            {% if page_data.has_prev %}
                <li class="page-item">
                    <a href="{{ url_for('mall.product_list', page=page_data.prev_num) }}?name={{ name }}" class="page-link">上一页</a>
                </li>
            {% else %}
                <li class="page-item disabled">
                    <a class="page-link">上一页</a>
                </li>
            {% endif %}
            {% for page in page_data.iter_pages() %}
                <li class="page-item  {% if page_data.page == page %}active{% endif %}"><a class="page-link" href="{{ url_for('mall.product_list', page=page) }}?name={{ name }}">{{ page }}</a></li>
            {% endfor %}
            {% if page_data.has_next %}
                <li class="page-item">
                  <a href="{{ url_for('mall.product_list', page=page_data.next_num) }}?name={{ name }}" class="page-link">下一页</a>
                </li>
            {% else %}
                <li class="page-item disabled">
                  <a class="page-link">下一页</a>
                </li>
            {% endif %}
            <li class="page-item disabled">
                <a class="page-link">{{ page_data.pages }}页</a>
            </li>
            <li class="page-item disabled">
                <a class="page-link">{{ page_data.total }}条数据</a>
            </li>
          </ul>
        </nav>
    </div>
{% endblock %}

{% block extrajs %}
    <script>
        $(function() {
            $(".del-prod").click(function() {
                var url = $(this).attr('data-url');
                var tr = $(this).parents('tr');
                if (confirm('确认删除该商品吗？')) {
                    $.post(url, function(rest) {
                        if (rest === 'ok') {
                            tr.addClass('d-none');
                            alert('删除成功')
                        } else {
                            alert('删除失败')
                        }
                    })
                }
            })
        })
    </script>
{% endblock %}